<template>
  <div class="app-container orginfo-container">
    <div class="app-container-flex">
      <NewFullScreen
        v-model="showDialog"
        title="机构信息"
        :btn-list="btnList"
        :needReturn="needReturn"
      >
        <template v-slot:full-button>
          <el-button
            @click="openUpdate"
            v-if="$permission('orgInfo:update') && showBtn"
            >修改</el-button
          >
        </template>
        <div class="model-panel">
          <div class="model-panel-title">
            <p>机构信息</p>
          </div>
          <div class="model-panel-body">
            <basic-information :info="orgInfo" :labelWidth="labelWidth">
              <template v-slot:basic-province>
                <address-info :data="orgAddress"></address-info>
              </template>
            </basic-information>
          </div>
        </div>
        <div class="model-panel">
          <div class="model-panel-title">
            <p>营业执照</p>
          </div>
          <div class="model-panel-body">
            <basic-information
              :info="certificateOfBusinessInfo"
              :labelWidth="labelWidth"
            >
              <template v-slot:basic-licenseFilePath>
                <ele-gallery
                  v-if="certificateOfBusinessInfo.data.licenseFilePath"
                  :lazy="true"
                  :size="150"
                  :source="certificateOfBusinessInfo.data.licenseFilePaths"
                  title="营业执照"
                />
                <span v-else>-</span>
              </template>
            </basic-information>
          </div>
        </div>
        <div class="model-panel">
          <div class="model-panel-title">
            <p>第三类医疗器械经营许可证</p>
          </div>
          <div class="model-panel-body">
            <basic-information
              :info="businessLicenseInfo"
              :labelWidth="labelWidth"
            >
              <template v-slot:basic-licenseFilePath>
                <ele-gallery
                  v-if="businessLicenseInfo.data.licenseFilePath"
                  :lazy="true"
                  :size="150"
                  :source="businessLicenseInfo.data.licenseFilePaths"
                  title="第三类医疗器械经营许可证"
                />
                <span v-else>-</span>
              </template>
            </basic-information>
          </div>
        </div>

        <div class="model-panel">
          <div class="model-panel-title">
            <p>第二类医疗器械经营备案凭证</p>
          </div>
          <div class="model-panel-body">
            <basic-information :info="businessRecordCertificate">
              <template v-slot:basic-licenseFilePath :labelWidth="labelWidth">
                <ele-gallery
                  v-if="businessRecordCertificate.data.licenseFilePath"
                  :lazy="true"
                  :size="150"
                  :source="businessRecordCertificate.data.licenseFilePaths"
                  title="第二类医疗器械经营备案凭证"
                />
                <span v-else>-</span>
              </template>
            </basic-information>
          </div>
        </div>
      </NewFullScreen>
      <modify-org-info
        v-if="showUpdate"
        v-model:visible="showUpdate"
        title="修改机构信息"
        :data="orgId"
        :type="type"
        @callback="callbackModify"
      ></modify-org-info>
    </div>
  </div>
</template>

<script setup name="orgInfo">
import ModifyOrgInfo from './modify'
import { getOrgInformation } from '@/api/core'
import EleGallery from '@/components/UploadImg/eleGallery'

const { proxy } = getCurrentInstance()

const showDialog = ref(true)
const btnList = ref([{ value: 'button', type: 'slot' }])
const orgInfo = ref({
  data: {},
  fieldList: [
    { label: '机构名称', value: 'name' },
    { label: '邮编', value: 'zipCode' },
    { label: '邮箱', value: 'mail' },
    { label: '地址', value: 'province', type: 'slot' },
    { label: '联系电话', value: 'phone' },
    { label: '传真', value: 'fax' },
    { label: '详细地址', value: 'address' },
    { label: '备注', value: 'remark' },
  ],
})
const certificateOfBusinessInfo = ref({
  data: {},
  fieldList: [
    { label: '证书编号', value: 'certificateNumber' },
    { label: '注册地址', value: 'registeredAddress' },
    { label: '公司类型', value: 'companyTypeValue' },
    {
      label: '注册资本(万元)',
      value: 'registeredCapital',
      formatter: proxy.$fn.TripartiteMethod,
    },
    { label: '成立时间', value: 'establishedDate' },
    { label: '经营范围', value: 'businessScope' },
    { label: '发证机关', value: 'issuingAuthority' },
    { label: '发证日期', value: 'issuingDate' },
    { label: '营业开始日期', value: 'startDate' },
    { label: '营业截止日期', value: 'endDate' },
    {
      label: '营业执照',
      value: 'licenseFilePath',
      type: 'slot',
      className: 'not-br',
    },
  ],
})
const businessLicenseInfo = ref({
  data: {},
  fieldList: [
    { label: '证书编号', value: 'certificateNumber' },
    { label: '企业名称', value: 'companyName' },
    { label: '注册地址', value: 'registeredAddress' },
    { label: '法定代表人', value: 'legalRepresentative' },
    { label: '企业负责人', value: 'responsiblePersons' },
    { label: '质量管理人', value: 'qualityManager' },
    { label: '经营范围', value: 'businessScope' },
    { label: '发证机关', value: 'issuingAuthority' },
    { label: '发证日期', value: 'issuingDate' },
    { label: '许可期限开始日期', value: 'startDate' },
    { label: '许可期限截止日期', value: 'endDate' },
    {
      label: '经营许可证',
      value: 'licenseFilePath',
      type: 'slot',
      className: 'not-br',
    },
  ],
})

const businessRecordCertificate = ref({
  data: {},
  fieldList: [
    { label: '备案编号', value: 'recordNumber' },
    { label: '备案日期', value: 'recordDate' },
    { label: '企业名称', value: 'businessName' },
    { label: '住所', value: 'registeredAddress' },
    { label: '经营场所', value: 'businessAddress' },
    { label: '库房地址', value: 'warehouseAddress' },
    { label: '经营方式', value: 'businessTypeValue' },
    { label: '法定代表人', value: 'legalRepresentative' },
    { label: '企业负责人', value: 'responsiblePersons' },
    { label: '经营范围', value: 'businessScope' },
    { label: '备注', value: 'remark' },
    {
      label: '证书附件',
      value: 'licenseFilePath',
      type: 'slot',
      className: 'not-br',
    },
  ],
})
const labelWidth = ref('140px')
const showUpdate = ref(false)
const type = ref('update')
const orgId = ref(proxy.$store.state.user.userInfo.user.orgId || '')
const orgAddress = ref([])
const needReturn = ref(false)
const showBtn = ref(true)

onMounted(() => {
  getData()
})

function getData() {
  getOrgInformation(orgId.value).then((res) => {
    if (res) {
      orgInfo.value.data = res.data.org || {}
      let { province, city, county } = orgInfo.value.data
      if (province) {
        orgAddress.value.push(province)
      }
      if (city) {
        orgAddress.value.push(city)
      }
      if (county) {
        orgAddress.value.push(county)
      }
      certificateOfBusinessInfo.value.data = res.data.businessLicense || {}
      businessLicenseInfo.value.data = res.data.businessPermit || {}
      businessRecordCertificate.value.data =
        res.data.businessRecordCertificate || {}
    }
  })
}
function openUpdate() {
  showUpdate.value = true
}
function handleRemove(index) {
  // 暂注释以下代码，感觉没有任何作用
  // if (multiple.value) {
  //   const data = [...computedValues.value]
  //   data.splice(index, 1)
  //   emits('input', data || [])
  // } else {
  //   emits('input', null)
  // }
}
function callbackModify(data) {
  if (data) {
    getData()
  }
}
</script>
<style lang="scss">
// .orginfo-container {
//   height: calc(100vh - 87px);
// }
</style>
<style scoped></style>
